C'est parti pour la création de votre configurateur de voiture !

Ici je vais vous donner quelques indications:

1. Evidemment la trame n'est qu'a titre indicatif, vous pouvez modifier comme bon vous semble

2. Les assets (images) sont à télécharger en ressources

3. Vous avez en fin de texte des captures d'écran pour vous aider

4. Le but principal ici est de réutiliser les widgets interactifs

Voici la trame que j'ai utilisé

• Une AppBar avec un bouton en action pour valider le choix de l'utilisateur

• Un titre de bienvenue avec le nom de l'utilisateur

• Une card montrant le résultat.

• Une textfield pour le nom

• Un Slider pour le nombre de kms

• Un Switch pour le type de moteur

• Un Radio pour le nombre de places

• Un Checkbox pour les options

Logique de validation:

1. Selon le moteur et le nombre de kilomètres

   1. Si l'utilisateur fait plus de  15 000 kms et veut un modèle électrique. Le résultat dans la card Renverra: "Vous devriez pensez à un moteur thermique compte tenu du nombre de kilomètres"

   2. Si l'utilisateur fait moins de  5 000 kms et veut un modèle thermique. Le résultat dans la card Renverra:"Vous faites peu de kilomètres, pensez à regarder les voitures électriques"

   3. Sinon "Voici la voiture faite pour vous"

2. Selon le moteur et le nombre de places:

   1. Créez une classe Voiture avec par exemple comme propriétés le nombre de places, le nom, le chemin vers l'image et le type de moteur

   2. Créez une liste de voitures avec toutes les voitures

   3. Selon le choix de l'utilisateur, renvoyez la voiture idéale. A vous de choisir la ou les méthodes. Je vous donne un exemple juste après

3. Les checkbox n'auront aucun effet dans la logique et ne serviront qu' ajouter pour nous un interactif !

Les Options en exemple:

final Map<String, bool> _options = {
  "GPS": false,
  "Caméra de recul": false,
  "Clim par zone": false,
  "Régulateur de vitesse": false,
  "Toit ouvrant": false,
  'Siège chauffant': false,
  "Roue de secours": false,
  "Jantes alu": false
};

Pour ceux qui calent dans la logique:

//La classe Car:


class Car {
  String name;
  String url;
  int places;
  bool isElectric;

  Car({required this.name, required this.url, required this.places, required this.isElectric});

  String get urlString => "assets/$url.jpg";
}

//La Liste de voitures
  final List<Car> _cars= [
    Car(name: "MG cyberster", url: "MG", places: 2, isElectric: true),
    Car(name: "R5 électrique", url: "R5", places: 4, isElectric: true),
    Car(name: "Tesla", url: "tesla", places: 5, isElectric: true),
    Car(name: "Van VW", url: "Van", places: 7, isElectric: true),
    Car(name: "Alpine", url: "Alpine", places: 2, isElectric: false),
    Car(name: "Fiat 500", url: "Fiat 500", places: 4, isElectric: false),
    Car(name: "Peugeot 3008", url: "P3008", places: 5, isElectric: false),
    Car(name: "Dacia Jogger", url: "Jogger", places: 7, isElectric: false),
  ];


//La logique de choix de voiture:
_carSelected = _cars.firstWhere((car) => car.isElectric == _electric && car.places == _placesSelected);